<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.bootcdn.net/ajax/libs/bulma/1.0.1/css/bulma.min.css" rel="stylesheet">
    <title>用户调查</title>
</head>
<body>
    <div class="columns">
        <div class="column is-6 is-offset-3">
            <h1 class="title">用户调查</h1>
            <form id="survey-form" action="./edit.do?id=${item.id}" method="post">
                <div class="field">
                    <label class="label">姓名</label>
                    <div class="control">
                        <input class="input" type="text" name="name" 
                            placeholder="请输入您的姓名" value="${item.name}"/>
                    </div>
                </div>
                <div class="field">
                    <label class="label">年龄</label>
                    <div class="control">
                        <input class="input" type="number" name="age" value="${item.age}"/>
                    </div>
                </div>
                <div class="field">
                    <label class="label">性别</label>
                    <div class="control">
                        <label class="radio">
                            <input type="radio" name="gender" value="male" ${item.gender == 'male' ? 'checked' : ''}>
                            男
                        </label>
                        <label class="radio">
                            <input type="radio" name="gender" value="female" ${item.gender == 'female' ? 'checked' : ''}>
                            女
                        </label>
                    </div>
                </div>
                <div class="field">
                    <label class="label">职业</label>
                    <div class="control">
                        <div class="select">
                            <select name="occupation">
                                <option value="student" ${item.occupation == 'student' ? 'selected' : ''}>学生</option>
                                <option value="teacher" ${item.occupation == 'teacher' ? 'selected' : ''}>教师</option>
                                <option value="engineer" ${item.occupation == 'engineer' ? 'selected' : ''}>工程师</option>
                                <option value="other" ${item.occupation == 'other' ? 'selected' : ''}>其他</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="field">
                    <label class="label">爱好</label>
                    <div class="control">
                        <label class="checkbox">
                            <input type="checkbox" name="hobbies" value="reading" 
                                ${item.hobbies.stream().toList().contains('reading') ? 'checked' : ''}>
                            阅读
                        </label>
                        <label class="checkbox">
                            <input type="checkbox" name="hobbies" value="music" 
                                ${item.hobbies.stream().toList().contains('music') ? 'checked' : ''}>
                            音乐
                        </label>
                        <label class="checkbox">
                            <input type="checkbox" name="hobbies" value="sports" 
                                ${item.hobbies.stream().toList().contains('sports') ? 'checked' : ''}> 
                            运动
                        </label>    
                    </div>
                </div>
                <div class="field">
                    <div class="control">
                        <button class="button is-primary" type="submit">提交</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</body>
</html>